<!DOCTYPE html>
<html style="height: 100%">
<head>
    <meta charset="utf-8">
    <style>
        input{
            width:50px;
        }
    </style>
</head>
<body style="height: 100%; margin: 0">
<div>
    <div class="pdf" style="background-image:url(/image/pdf.png);width: 453px;height: 641px;margin: 0 auto">
        <div class="form"  style="width: 85%;height: 20%;background: beige">

        </div>
        <div class="table-1" style="width: 85%;height: 20%;background: beige">
            <div id="container" style="height: 100%"></div>
        </div>
        <div class="table-2"  style="width: 85%;height: 20%;background: beige">
            <form method="post" action="form">
                <table bgcolor="#ccc">
                    <thead>
                    <tr>
                        <th></th>
                        <th>RT</th>
                        <th>Area</th>
                        <th>Height</th>
                        <th>Total area</th>
                        <th>%Area</th>
                        <th>Result</th>
                    </tr>
                    </thead>
                    <tbody id="tb">
                        <tr>
                            <td>1</td>
                            <td><input type="text" name="RT[]"></td>
                            <td><input type="text" name="Area[]"></td>
                            <td><input type="text" name="Height[]"></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                    </tbody>
                </table>
            </form>
        </div>
        <!--        <div id="container" style="height: 100%"></div>-->
    </div>
</div>




<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5.4.3/dist/echarts.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript">










</script>


</body>
</html>